<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>table</title>
    <style type="text/css">
        table{
            border-collapse: collapse;
            max-width: 500px;
        }
        .table2{
            border:#000 3px solid;
        }
        .table1 td, .table2 td, .table4 td,.table5 td{
            border: #000 1px solid;
        }
        .table3 td{
            border:#000 1px dashed;
        }
        .table4{
            border: #000 3px double;
        }
        .table6{
            border-top:#000 1px solid;
        }
        .table5{
            border-collapse:separate;
            border-spacing: 10px;
        }
        .table6 td{
            border-bottom:#000 1px solid;
        }
    </style>
</head>
<body>
<p>细边框细线表格</p>
<table class="table1" width="100%">
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
</table>
<p>粗边框细线表格</p>
<table class="table2" width="100%">
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
</table>
<p>虚线表格</p>
<table class="table3" width="100%">
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
</table>
<p>双线表格</p>
<table class="table4" width="100%">
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
</table>
<p>宫字表格</p>
<table class="table5" width="100%">
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
</table>
<p>单线表格</p>
<table class="table6" width="100%">
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
    <tr>
        <td>&nbsp</td><td>&nbsp</td>
    </tr>
</table>
</body>
</html>